<script setup>

import ScopeSlot from "./ScopeSlot.vue";
</script>

<template>
  <ScopeSlot></ScopeSlot>
  <hr>

  <!--传统写法/经典写法/对象写法-->
  <ScopeSlot>
    <template v-slot:default="obj">
      <div>姓名：{{ obj.na }}</div>
      <div>性别：{{ obj.gender }}</div>
      <div>年龄：{{ obj.age }}</div>
    </template>
  </ScopeSlot>

  <hr>

  <!--解构写法-->
  <ScopeSlot>
    <template v-slot:default="{na, gender, age}">
      <div>姓名：{{ na }}</div>
      <div>性别：{{ gender }}</div>
      <div>年龄：{{ age }}</div>
    </template>
  </ScopeSlot>

</template>

<style scoped>

</style>